<template>
  <view class="page-default">
    <c-nav-bar title="致学生及家长的一封信" type="white" bg-color="rgba(255,255,255,0.6)" />
    <view>
      <view class="content bg-green-white m-4 mt-6 rounded-4 px-4 pb-8 pt-4 line-height-6">
        <view class="px-1 line-height-8">
          <view class="my-4 text-center text-lg text-#1A2B5C">
            特殊体质调查表
          </view>
          <view class="mb-4 text-center text-lg text-#1A2B5C">
            回执
          </view>
          <view class="indent-7">
            <view>贵校下发的《特殊体质学生调查表》中内容我已仔细阅读，所填信息为本人亲自填写，保证真实有效。</view>
          </view>
          <view>需要学校予以保密的信息有：</view>
          <up-textarea placeholder="请输入需要保密的内容" height="120" class="mt-2" />
        </view>
      </view>
      <view class="mx-8">
        <view class="flex items-start">
          <up-checkbox-group>
            <u-checkbox
              shape="circle"
              active-color="#00E0AE"
              class="flex-shrink-0"
            />
          </up-checkbox-group>
          <text class="text-sm text-#C5C9D1 line-height-6">
            我是学生家长，我<text class="text-#3AA69B">
              已认真阅读并如实填写
            </text>以上所有信息，<text class="text-#3AA69B">
              如因信息不真实导致的后果，由家长和学生自行承担。
            </text>（如没有需要保密的信息，则填写“无”）
          </text>
        </view>
      </view>
      <view class="mx-8 pb-2">
        <u-button size="default" shape="circle" class="gradient-button mb-8 mt-6" @click="goNextPage">
          <text class="text-base text-white">
            提交
          </text>
        </u-button>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
const goPage = () => {
  uni.$u.route({
    url: '/pages/biz/information/signature',
  });
};
</script>

<style lang="scss" scoped>
  .page-default{
    width: 100%;
    min-height: 100vh;
    background: url('@/static/images/welcome/header-bg.png') no-repeat center top;
    background-size: 100% 50%;
  }
  .bg-green-white{
    background: linear-gradient(to bottom, #f6fdfa, #fff, #fff); /* 渐变色设置 */
  }
  :deep(.u-textarea--radius){
    border-radius: 8px;
  }
  :deep(.u-border){
    border-color: #E0E7EC !important
  }
</style>
